<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>宏任务与微任务</title>
</head>
<body>
<script>
    // 简易版
    /*setTimeout(() => {
      console.log(1)
    });
    new Promise((resolve => {
      console.log(2);
      resolve();
    })).then(() => {
      console.log(3)
    }).then(() => {
      console.log(4)
    });
    console.log(5);*/

    // 加大难度 1 2 5 6 3
    /*const first = () => new Promise(resolve => {
      console.log(1);
      const p = new Promise(resolve1 => {
        console.log(2);
        setTimeout(() => {
          console.log(3);
          resolve1(4);
        });
        resolve1(5);
      });
      resolve(6);
      p.then(value => {
        console.log(value);
      })
    });
    first().then(value => {
      console.log(value)
    })*/

    /* 2 3 4 5 8 6 9 7 1
     Macro: [1]
     Micro: [9, 7]
     */
    setTimeout(() => {
        console.log(1);
    });
    new Promise(resolve => {
        console.log(2);
        resolve(4)
    }).then(value => {
        console.log(value);
        new Promise(resolve => {
            console.log(5);
            resolve(6);
        }).then(value1 => {
            console.log(value1);
        }).then(() => {
            console.log(7)
        })
    }).then(() => {
        console.log(9);
    });
    new Promise(resolve => {
        console.log(3);
        resolve(8);
    }).then(value => {
        console.log(value)
    })
</script>
</body>
</html>
